<template>
  <div>
    <!-- 可用人员详情Table -->
    <p-table
      ref="table"
      size="middle"
      bordered
      rowKey="id"
      :columns="columns"
      :scroll="{ x: 1366 }"
      :dataSource="dataSource"
      :loading="loading"
      :rowSelection="{
        selectedRowKeys: selectedRowKeys,
        onChange: onSelectChange,
        type: 'radio',
      }"
    >
      <template slot="skillname" slot-scope="text, row">
        <a @click="handleHumanTable(row)">{{ text }}</a>
      </template>
    </p-table>
  </div>
</template>  

                    <script>
import { postAction, getAction, deleteAction } from "@/api/manage";
// import { JeecgListMixin } from "@/mixins/JeecgListMixin";
import Vue from "vue";

export default {
  name: "",
  // mixins: [JeecgListMixin],
  props: {
    childData: {
      type: Object,
      default() {
        return {};
      },
    },
  },

  data() {
    return {
      loading: false,
      peopleList: [],
      dataSource: [],
      AllArr: [],
      EnhanceJS: "",
      cgButtonLinkList: [],
      selectedRowKeys: [],
      cgButtonList: [],
      title: "", //存表名
      groupTag: [],
      queryInfo: [],
      code: "",
      // 表头
      columns: [],
      //列设置
      settingColumns: [],
      //列定义
      defColumns: [
        {
          title: "序号",
          dataIndex: "id",
          key: "rowIndex",
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          },
        },
        {
          title: "工号",
          dataIndex: "empno",
          key: "empno",
          // width: "15%",
          align: "center",
          scopedSlots: { customRender: "empno" },
        },
        {
          title: "姓名",
          dataIndex: "empname",
          key: "empname",
          // width: "40%",
          align: "center",
          scopedSlots: { customRender: "empname" },
        },

        {
          title: "线体",
          dataIndex: "linename",
          key: "linename",
          align: "center",
          scopedSlots: { customRender: "linename" },
        },
        {
          title: "班次",
          dataIndex: "classname",
          key: "classname",
          align: "center",
          scopedSlots: { customRender: "classname" },
        },
        {
          title: "技能",
          dataIndex: "skillElements",
          key: "skillElements",
          align: "center",
          customRender: function (t, r, index) {
            let text = "";
            t.forEach((item) => {
              text += item.name + ",";
            });
            return text;
          },
        },
        {
          title: "技能编码",
          dataIndex: "skillElements",
          key: "skillElements",
          align: "center",
          customRender: function (t, r, index) {
            let text = "";
            t.forEach((item) => {
              text += item.code + ",";
            });
            return text;
          },
        },
        {
          title: "电话",
          dataIndex: "telephone",
          key: "telephone",
          align: "center",
          scopedSlots: { customRender: "telephone" },
        },

        {
          title: "累计工时",
          dataIndex: "",
          key: "telephone",
          align: "center",
          scopedSlots: { customRender: "" },
        },
        {
          title: "人员已排工时",
          dataIndex: "detailsHaverowtime",
          key: "detailsHaverowtime",
          align: "center",
          scopedSlots: { customRender: "detailsHaverowtime" },
        },
        {
          title: "工站",
          dataIndex: "detailsHaverowtime",
          key: "detailsHaverowtime",
          align: "center",
          scopedSlots: { customRender: "detailsHaverowtime" },
        },
        {
          title: "工站名称",
          dataIndex: "workstationName",
          key: "workstationName",
          align: "center",
          scopedSlots: { customRender: "workstationName" },
        },
        {
          title: "技能要求",
          dataIndex: "skillname",
          key: "",
          align: "center",
          scopedSlots: { customRender: "skillname" },
        },
      ],
      /* 分页参数 */
      // ipagination: {
      //   current: 1,
      //   pageSize: 10,
      //   pageSizeOptions: ["10", "20", "50"],
      //   showTotal: (total, range) => {
      //     return range[0] + "-" + range[1] + " 共" + total + "条";
      //   },
      //   showQuickJumper: true,
      //   showSizeChanger: true,
      //   total: 0,
      // },
      url: {
        list: "/mes-manufacture/mfSurplusManpower/list/available",
      },
    };
  },
  watch: {
    childData() {
      this.loadData();
    },
    peoList() {
      if (this.peoList) {
        this.peoList.forEach((item) => {
          this.data.push(item.empno);
        });
      }
      // this.loadData()
    },
  },
  created() {
    this.initColumns();
    this.setdefColumns();
    this.loadData();
  },
  
  methods: {
    clickThenSelect(record) {
      return {
        on: {
          click: () => {
            this.onSelectChange(record.empno, [record]);
          },
        },
      };
    },
    tableScroll: function () {
      if (this.columns.length > 13) {
        return { x: this.columns.length * 150 - 450 };
      }
    },
    setdefColumns() {
      if (this.columns.length >= 12) {
        let arrLength = this.columns.length - 1;
        this.columns.forEach((item, index) => {
          item["width"] = 130;
        });
        this.columns[arrLength]["fixed"] = "right";
      }
    },
    initColumns() {
      //权限过滤（列权限控制时打开，修改第二个参数为授权码前缀）
      //this.defColumns = colAuthFilter(this.defColumns,'testdemo:');

      var key = this.$route.name + ":colsettings";
      let colSettings = Vue.ls.get(key);
      if (colSettings == null || colSettings == undefined) {
        let allSettingColumns = [];
        this.defColumns.forEach(function (item, i, array) {
          allSettingColumns.push(item.dataIndex);
        });
        this.settingColumns = allSettingColumns;
        this.columns = this.defColumns;
      } else {
        this.settingColumns = colSettings;
        const cols = this.defColumns.filter((item) => {
          if (item.key == "rowIndex" || item.dataIndex == "action") {
            return true;
          }
          if (colSettings.includes(item.dataIndex)) {
            return true;
          }
          return false;
        });
        this.columns = cols;
      }
    },

    //列设置更改事件
    onColSettingsChange(checkedValues) {
      var key = this.$route.name + ":colsettings";
      Vue.ls.set(key, checkedValues, 7 * 24 * 60 * 60 * 1000);
      this.settingColumns = checkedValues;
      const cols = this.defColumns.filter((item) => {
        if (item.key == "rowIndex" || item.dataIndex == "action") {
          return true;
        }
        if (this.settingColumns.includes(item.dataIndex)) {
          return true;
        }
        return false;
      });
      this.columns = cols;
    },
    onClearSelected() {
      this.selectedRowKeys = [];
      this.selectionRows = [];
      this.selectedMainId = "";
    },
    onSelectChange(selectedRowKeys, selectionRows) {
      this.selectedMainId = selectedRowKeys[0];
      this.selectedRowKeys = selectedRowKeys;
      this.selectionRows = selectionRows;
    },
    remove() {
      if (this.childData.data.empno) {
        this.peopleList.forEach((item, index) => {
          if (item.empno == this.childData.data.empno) {
            this.peopleList.splice(index, 1);
          }
        });
        this.peopleList.push(this.selectionRows[0]);
        //  this.removePeolist()
        this.selectionRows[0].lengthNumber = this.dataSource.length;
        this.$emit("obtainPeople", this.selectionRows[0]);
      } else {
        this.peopleList.push(this.selectionRows[0]);
        this.removePeolist();
        this.selectionRows[0].lengthNumber = this.dataSource.length;
        this.$emit("obtainPeople", this.selectionRows[0]);
      }

      // this.removePeolist()
      // this.selectionRows[0].lengthNumber=this.dataSource.length
      // this.$emit("obtainPeople",this.selectionRows[0])
    },
    removePeolist() {
      if (this.peopleList.length > 0) {
        this.dataSource.forEach((item, index) => {
          this.peopleList.forEach((items, num) => {
            if (item.empno == items.empno) {
              this.dataSource.splice(index, 1);
            }
          });
        });
      }
    },

    loadData(arg) {
      if (!this.url.list) {
        this.$message.error("请设置url.list属性!");
        return;
      }
      //加载数据 若传入参数1则加载第一页的内容
      // if (arg === 1) {
      //   this.ipagination.current = 1;
      // }
      this.onClearSelected();
      let data = {
        excludeEmpnos: this.data,
        classno: this.childData.classtimeno, //班组编码
        lineno: this.childData.lineno, //线体编码
        workroomno: this.childData.workroomno, //车间编码
      };
      this.loading = true;
      postAction(this.url.list, data).then((res) => {
        if (res.success) {
          let arr = [];
          res.data.records.forEach((item, index) => {
            item.id = index;
            item.skillElements.forEach((items) => {
              if (items.code == this.childData.skillcode) {
                item.skillname = this.childData.skillname;
                arr.push(item);
              }
            });
          });
          console.log("加载数据");
          this.dataSource = arr;
          this.AllArr = arr;
          this.removePeolist();
        }
        if (res.code === 510) {
          this.$message.warning(res.msg);
        }
        this.loading = false;
      });
    },
  },
};
</script>
